<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>Morse Code</title>
  <!-- layui -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
  
  <link rel="stylesheet" href="./layuistyle.css"><script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>

<!-- morse telegraph -->
  <link href='https://fonts.googleapis.com/css?family=Source+Code+Pro:500' rel='stylesheet' type='text/css'><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
  
  <link rel="stylesheet" href="./morse telegraph.css"><script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>

</head>

<body>
<!-- partial:index.partial.html -->
<ul class="nav nav-tabs" id="myTab">
  <li class="active"><a href="#home">摩斯介绍</a></li>
  <li><a href="#profile">摩斯电报机</a></li>
  <li><a href="#messages">摩斯音频表</a></li>
  <li><a href="#settings"  target="_blank">摩斯翻译器</a></li>
</ul>
 
<div class="tab-content">
  <div class="tab-pane active" id="home">
  	<div class="container">
			
</div>
<!-- morse telegraph -->
  <div class="tab-pane" id="profile">
  
  <div class="telegraph animated fadeInDown">
  <div class="telegraph__tapper" title="Tap me!"></div>
</div>
<div class="headline">
  <h1>
    摩尔斯电报机
  </h1>
  <h2>
   
  </h2>
  <h4>
    敲击敲击器（或按空格键），然后开始发出滴滴声！
  </h4>
</div>
<div class="morse-code-output"></div>
<!-- morse telegraph partial -->
  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script  src="./morse telegraph.js"></script>

  </div>
  

<div class="tab-pane" id="messages">


</div>



<!-- partial -->
  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js'></script>
<script  src="./layuiscript.js"></script>

</body>
</html>